import { defineComponent } from 'vue'
// import { useRoute } from 'vue-router'

export default defineComponent({
  name: 'index',
  setup () {
    // const route = useRoute()
    // 获取所有路由 route 为当前路由代理
    // console.log('route:', route.path, toRaw(route))
    return () => (
      <div class='contentCenter'>
        <div>
          <h3>常用插件</h3>
          <p>
            在自定脚手架中需要按需装载各种插件，没用网上开箱即用的脚手架方便。
            当然你会用了webpack或者vite，这些都不是什么问题。
            之前有做过几个脚手架可以看下，有vue和react的。
            <a href="https://gitee.com/miss-tree/webpack-react-ts"
              target="_blank" rel="noopener noreferrer">webpack-react-ts</a>、
            <a href="https://gitee.com/miss-tree/webpack-vue-ts"
              target="_blank" rel="noopener noreferrer">webpack-vue-ts</a>。
          </p>
        </div>
        <div>
          <ul>
            <li>
              <router-link to="/usuallyPlugin">
                常用插件 
              </router-link>
            </li>
            <li>
              <router-link to="/compression">
                文件压缩  compression-webpack-plugin
              </router-link>
            </li>
            <li>
              <router-link to="/react">
                webpack  react 配置
              </router-link>
            </li>
            <li>
              <router-link to="/Instructions">
                指令
              </router-link>
            </li>
            <li>
              <router-link to="/Refs">
                Refs
              </router-link>
            </li>
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
      </div>
    )
  }
})